<!--
 * @FileDescription: hr管理公司员工界面
 * @Author: 叶永鸿、袁年政
 * @Date: 2021-7-17
 * @LastEditors: 叶永鸿
 * @LastEditTime: 2021-7-18
 -->
<template>
  <el-container>
    <el-main>
      <div style="margin: 0, auto; text-align: center">
        <el-button class="btn" size="mini" v-if="isOn" @click="toIsOff"
          >查看离职员工</el-button
        >
        <el-button class="btn" size="mini" v-if="!isOn" @click="toIsOn"
          >查看在职员工</el-button
        >
        <el-table
          :data="managedInfor"
          style="width: 80%; margin: auto; fontsize: 22px"
          max-height="600"
        >
          <el-table-column prop="realname" label="姓名" width="120%">
          </el-table-column>
          <el-table-column prop="telephone" label="电话" width="120%">
          </el-table-column>
          <el-table-column prop="gender" label="性别" width="80%">
          </el-table-column>
          <el-table-column prop="email" label="邮箱" width="200%">
          </el-table-column>
          <el-table-column width="140%" align="center" fixed="right">
            <template #header>
              <div>
                <el-input
                  v-model="manageSearchName"
                  size="mini"
                  @keydown.enter="manageSearchSubmit"
                  placeholder="输入关键字搜索"
                />
              </div>
            </template>
            <template #default="scope">
              <el-button size="mini" @click="manageCheck(scope.row)"
                >查看</el-button
              >
              <!-- <el-button size="mini" @click="manageChange(scope.row)"
                >修改</el-button
              > -->
            </template>
          </el-table-column>
          <el-table-column style="width: 50" fixed="right">
            <template #header>
              <el-button circle size="mini" icon="el-icon-close"></el-button>
            </template>
            <template #default="scope">
              <el-button
                size="mini"
                type="danger"
                @click="manageLeave(scope.row)"
                >离职</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          background
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          layout="prev, pager, next"
          :total="totalPage * 10"
          v-show="totalPage != 1"
          v-cloak
        >
        </el-pagination>
      </div>
    </el-main>
  </el-container>
  <!--<div>
      <el-input v-model="manageSearchName" placeholder="请输入员工姓名或者电话" style="width: 30%;"></el-input>
      <el-button type="primary" @click="manageSearchSubmit">搜索</el-button>
    </div>-->
</template>

<script>
import { Store } from "vuex";
export default {
  name: "manage",
  data() {
    return {
      manageSearchName: this.$store.state.hrManage.hrManageSearchName,
      managedInfor: this.$store.state.hrManage.hrManagePerPage,
      currentPage: this.$store.state.hrManage.hrManagePage,
      totalPage: this.$store.state.hrManage.hrManageTotalPage,
      tmpTotalPage: 1,
      isOn : this.$store.state.manageIsOn,
    };
  },
  methods: {
    manageSearchSubmit: function () {
      var that = this;
      //在管理页面下的搜索员工功能函数
      this.$axios
        .get("http://47.100.167.206:8082/Manage/queryOne", {
          params: { nameortel: this.manageSearchName },
          headers: { token: this.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            console.log(response);
            that.managedInfor = response.data.data;

            that.tmpTotalPage = that.totalPage;
            that.totalPage = 1;
          },
          function (err) {
            that.$message({
              type: "error",
              message: "网络错误，搜索失败",
            });
          }
        );
      console.log(this.manageSearchName);
    },
    manageCheck: function (row) {
      //查看某个员工的具体信息
      var that = this;
      var expid;
      console.log(row.telephone);
      this.$axios
        .get("http://47.100.167.206:8082/Manage/manageexp", {
          params: {
            tel: row.telephone,
          },
          headers: { token: this.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            console.log(row);
            console.log(response.data.data);
            expid = response.data.data.expid;
            that.$store.commit("hrManage", {
              //离开页面之前先保存当前页面的搜索信息
              hrManagePage: that.currentPage,
              hrManageTotalPage: that.totalPage,
              hrManageSearchName: that.manageSearchName,
              hrManagePerPage: that.managedInfor,
            });

            var these = response.data.data; //暂时存储用户的信息。
            that.$axios
              .get("http://47.100.167.206:8082/Query/searchone", {
                params: { tel: row.telephone },
                headers: { token: that.$store.getters.getUserInfor.token },
              })
              .then(
                function (response) {
                  console.log(response);
                  that.$store.commit("hrManageCheck", {
                    hrManageCheckInfor: row, //保存获得的信息
                    hrManageCheckInforDetails: these,
                    hrMangeCheckExperience: response.data.data,
                  });
                  that.$axios
                    .get(
                      "http://47.100.167.206:8082/Query/hrqueryPerformance",
                      {
                        params: { expid: expid },
                        headers: {
                          token: that.$store.getters.getUserInfor.token,
                        },
                      }
                    )
                    .then(
                      function (response) {
                        console.log(response);
                        if (response.data.message == "successquery") {
                          that.$store.commit("PerformanceForHr", {
                            performances: response.data.data,
                            empExpid: expid,
                          });
                          that.$router.push({
                            //跳转路由
                            path: "/hrMain/manageInfor",
                            query: { telEmp: row.telephone },
                          });
                        }
                      },
                      function (err) {
                        console.log(err);
                      }
                    );
                },
                function (err) {
                  console.log(err);
                }
              );
          },
          function (err) {
            that.$message({
              type: "error",
              message: "网络错误，查看失败",
            });
          }
        );
    },
    manageLeave: function (row) {//为具体员工进行离职
      
      var that = this;
      var expid;
      console.log(row);
      this.$axios
        .get("http://47.100.167.206:8082/Manage/manageexp", {
          params: {
            tel: row.telephone,
          },
          headers: { token: this.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            console.log(response);
            console.log(response.data.data);
            expid = response.data.data.expid;
            that.$store.commit("hrManage", {
              //离开页面之前先保存当前页面的搜索信息
              hrManagePage: that.currentPage,
              hrManageTotalPage: that.totalPage,
              hrManageSearchName: that.manageSearchName,
              hrManagePerPage: that.managedInfor,
            });

            var these = response.data.data; //暂时存储用户的信息。
            that.$axios
              .get("http://47.100.167.206:8082/Query/searchone", {
                params: { tel: row.telephone },
                headers: { token: that.$store.getters.getUserInfor.token },
              })
              .then(
                function (response) {
                  console.log(response);
                  that.$store.commit("hrManageCheck", {
                    hrManageCheckInfor: row, //保存获得的信息
                    hrManageCheckInforDetails: these,
                    hrMangeCheckExperience: response.data.data,
                  });

                  that.$axios
                    .get(
                      "http://47.100.167.206:8082/Query/hrqueryPerformance",
                      {
                        params: { expid: expid },
                        headers: {
                          token: that.$store.getters.getUserInfor.token,
                        },
                      }
                    )
                    .then(
                      function (response) {
                        console.log(response);
                        if (response.data.message == "successquery") {
                          that.$store.commit("PerformanceForHr", {
                            performances: response.data.data,
                            empExpid: expid,
                          });
                          that.$router.push({
                            //跳转路由
                            path: "/hrMain/manageInfor",
                            query: { telEmp: row.telephone },
                          });
                        }
                      },
                      function (err) {
                        console.log(err);
                      }
                    );
                },
                function (err) {
                  that.$message({
                    type: "error",
                    message: "网络错误，查看失败",
                  });
                }
              );
          },
          function (err) {
            that.$message({
              type: "error",
              message: "网络错误，查看失败",
            });
          }
        );
    },
    handleCurrentChange(val) {
      //换页功能函数
      this.currentPage = val;
      var that = this;
      
      if(this.isOn){
      this.$axios
        .get("http://47.100.167.206:8082/Manage/queryAllOn", {
          params: {
            page: this.currentPage,
          },
          headers: { token: that.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            console.log(response);
            that.$store.commit("hrManage", {
              hrManagePage: that.currentPage,
              hrManageTotalPage: that.totalPage,
              hrManageSearchName: "",
              hrManagePerPage: response.data.data,
            });
            that.managedInfor=response.data.data;
          },
          function (err) {
            console.log(err);
          }
        );}
        else{
      this.$axios
        .get("http://47.100.167.206:8082/Manage/queryAllOff", {
          params: {
            page: this.currentPage,
          },
          headers: { token: that.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            console.log(response);
            that.$store.commit("hrManage", {
              hrManagePage: currentPage,
              hrManageTotalPage: that.totalPage,
              hrManageSearchName: "",
              hrManagePerPage: response.data.data,
            });
            that.managedInfor=response.data.data;
          },
          function (err) {
            console.log(err);
          }
        );}
    },
    toIsOn() {//查看在职员工
      var that = this;
      that.currentPage= 1;
      var totalPage;
      //var manageSearchName = this.$store.state.hrManage.hrManageSearchName;

      this.$axios
        .get("http://47.100.167.206:8082/Manage/queryOnPage", {
          headers: { token: this.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            totalPage = response.data.data;
            that.totalPage = response.data.data;
            that.$axios
              .get("http://47.100.167.206:8082/Manage/queryAllOn", {
                params: {
                  page: 1,
                },
                headers: { token: that.$store.state.loginInfor.token },
              })
              .then(
                function (response) {
                  console.log(response);
                  that.$store.commit("hrManage", {
                    hrManagePage: 1,
                    hrManageTotalPage: totalPage,
                    hrManageSearchName: "",
                    hrManagePerPage: response.data.data,
                  });
                  that.$store.commit("isOnChange", false);
                  that.managedInfor = response.data.data;
                  //console.log("okTOPush");
                  that.isOn=true;
                  
                },
                function (err) {
                  that.$message({
                    type: "error",
                    message: "网络错误，查看失败",
                  });
                  console.log(err);
                }
              );
          },
          function (err) {}
        );
    },
    toIsOff() {//查看在职员工
      var that = this;
      that.currentPage= 1;
      var totalPage;
      //var manageSearchName = this.$store.state.hrManage.hrManageSearchName;

      this.$axios
        .get("http://47.100.167.206:8082/Manage/queryOffPage", {
          headers: { token: this.$store.state.loginInfor.token },
        })
        .then(
          function (response) {
            totalPage = response.data.data;
            that.totalPage = response.data.data;
            that.$axios
              .get("http://47.100.167.206:8082/Manage/queryAllOff", {
                params: {
                  page: 1,
                },
                headers: { token: that.$store.state.loginInfor.token },
              })
              .then(
                function (response) {
                  console.log(response);
                  that.$store.commit("hrManage", {
                    hrManagePage: 1,
                    hrManageTotalPage: totalPage,
                    hrManageSearchName: "",
                    hrManagePerPage: response.data.data,
                  });
                  that.$store.commit("isOnChange", false);
                  that.managedInfor = response.data.data;
                  that.isOn=false;
                  
                },
                function (err) {
                  that.$message({
                    type: "error",
                    message: "网络错误，查看失败",
                  });
                  console.log(err);
                }
              );
          },
          function (err) {}
        );
    },
  },
};
</script>

<style scoped>
.btn {
  position: relative;
  margin-left: 70%;
  margin-bottom: 1%;
}
</style>
